<template>
  <el-dialog
    title="参数管理"
    width="35%"
    :close-on-click-modal="false"
    :visible.sync="params.visible"
  >
    <compTable
      ref="table"
      :show-search="false"
      :show-checkbox="true"
      :table-height="350"
      :table-header="tableHeader"
      :table-data="tableData"
      @selection-change="getAllCheckedRows"
    />
    <dialog-btn slot="footer">
      <div v-show="isSettingBtn" class="pull-left">
        <el-button @click="addRow">增加</el-button>
        <el-button @click="deleteRow">删除</el-button>
      </div>
    </dialog-btn>
    <select-user-plan-layer v-if="selectUserPlanLayerParams.visible" :params="selectUserPlanLayerParams" />
    <!-- <show-layer-input ref="showLayerInput" :params="param" /> -->
    <!-- 输入框 -->
    <input-dialog v-if="inputDialogParams.visible" :params="inputDialogParams" />
    <select-flow-2 v-if="selectFlowParams.visible" :params="selectFlowParams" />
    <select-agent-layer v-if="selectAgentLayerParams.visible" :params="selectAgentLayerParams" />
    <!-- 此处为点击参数的新版弹窗 -->
    <library-setting
      v-if="LibrarySettingParams.visible"
      :params="LibrarySettingParams"
    />
  </el-dialog>
</template>

<script>
/**
 * 入参：{
 *  FlpParam,
 *  sTaskID
 * }
 */
import Commonmsg from '@/../public/js/commonmsg'
import Global from '@/../public/js/global'
import SelectUserPlanLayer from './SelectUserPlanLayer.vue'
// import ShowLayerInput from './ShowLayerInput.vue'
import InputDialog from '@/components/Dialog/InputDialog'
import { ParamArr } from '@/../public/js/paramarr'

import SelectFlow2 from './SelectFlow2.vue'
import SelectAgentLayer from './SelectAgentLayer.vue'
import LibrarySetting from '@/components/Dialog/LibrarySetting.vue'
export default {
  name: 'TaskParamsManage',
  // components: { SelectUserPlanLayer, ShowLayerInput, SelectFlow2, SelectAgentLayer, LibrarySetting },
  components: { SelectUserPlanLayer, InputDialog, SelectFlow2, SelectAgentLayer, LibrarySetting },
  props: {
    params: {
      type: Object,
      default() {
        return {
          visible: true, // 是否显示当前窗口
          FlpParam: '', // 传入参数
          sTaskID: '' // 传入参数
        }
      }
    }
  },
  data() {
    return {
      visible: false,
      tableHeader: [],
      tableData: [],
      settingArr: [
        '任务提示框',
        '同步数据',
        '更新动态基线',
        '导入佣金数据',
        '导出组件库',
        '机器补丁',
        '同步SQLite数据库'
      ],
      isSettingBtn: false,
      taskId: '',
      FlpParam: {},
      rows: [],
      param: {}, // 弹窗传参
      // 新弹窗传参
      LibrarySettingParams: {
        visible: false
      },
      // 增加分组弹窗
      inputDialogParams: {
        visible: false
      },
      // 选择用户弹窗
      selectUserPlanLayerParams: {
        visible: false
      },
      elTab: 'selectUser', // 选择用户弹窗 传入的是哪个el-tab
      sID: '', // 选择用户弹窗 传入的id
      selectFlowParams: {
        visible: false
      },
      selectAgentLayerParams: {
        visible: false
      }

    }
  },
  mounted() {
    this.initWindow()
  },
  methods: {
    initWindow() {
      this.taskId = this.params.sTaskID
      this.FlpParam = this.params.FlpParam
      this.isSettingBtn =
        this.settingArr.indexOf(Commonmsg.getTaskName(this.taskId)) === -1
      if (!this.isSettingBtn) {
        this.tableHeader = [
          { prop: 'name', label: '名称', isShow: true },
          { prop: 'paramName', label: '参数值', isShow: true },
          {
            prop: 'setting',
            label: '设置',
            isShow: true,
            width: '80px',
            render: (h, params) => {
              return h(
                'el-button',
                {
                  on: {
                    click: () => {
                      this.onSetting(params.row)
                    }
                  }
                },
                '设置'
              )
            }
          }
        ]
      } else {
        this.tableHeader = [
          {
            prop: 'name',
            label: '名称',
            isShow: true,
            isEdit: true,
            showTooltip: 'noShow',
            placeholder: '请输入名称'
          },
          {
            prop: 'paramName',
            label: '参数值',
            isShow: true,
            isEdit: true,
            showTooltip: 'noShow',
            placeholder: '请输入参数值'
          }
        ]
      }
      this.initTableRowData()
      this.visible = true
    },
    getAllCheckedRows(rows) {
      this.rows = rows
    },
    // 表格设置功能
    onSetting(row) {
      if (this.taskId === Commonmsg.getTaskID('任务提示框')) {
        if (row.name === '任务提示用户') {
          this.selectUserPlanLayerParams.sID = row.paramID
          this.selectUserPlanLayerParams.sName = row.paramName
          this.selectUserPlanLayerParams.iType = 1
          this.selectUserPlanLayerParams.isNullSelect = true
          this.selectUserPlanLayerParams.ismutil = true
          this.selectUserPlanLayerParams.iTabName = this.elTab
          this.selectUserPlanLayerParams.visible = true
          this.selectUserPlanLayerParams.confirm = (res) => {
            row.paramName = res.sName
            this.elTab = res.sTab
            row.paramID = res.sID
            this.selectUserPlanLayerParams.visible = false
          }
        } else {
          const inputDialogParams = this.inputDialogParams
          inputDialogParams.visible = true
          inputDialogParams.title = '请输入任务提示信息'
          inputDialogParams.label = '提示信息'
          inputDialogParams.value = row.paramName
          inputDialogParams.name = 'value'
          inputDialogParams.type = 'textarea'
          inputDialogParams.confirm = (res) => {
            row.paramName = res.value
            inputDialogParams.visible = false
          }
        }
      } else if (this.taskId === Commonmsg.getTaskID('更新动态基线')) {
        // 控制台未见此任务
      } else if (this.taskId === Commonmsg.getTaskID('导出组件库')) {
        const inputDialogParams = this.inputDialogParams
        inputDialogParams.visible = true
        inputDialogParams.title = '请输入导出组件库路径'
        inputDialogParams.label = '组件库路径'
        inputDialogParams.labelWidth = '100px'
        inputDialogParams.value = row.paramName
        inputDialogParams.name = 'value'
        inputDialogParams.type = 'textarea'
        inputDialogParams.confirm = (res) => {
          row.paramName = res.value
          inputDialogParams.visible = false
        }
      } else if (this.taskId === Commonmsg.getTaskID('导入佣金数据')) {
        // 控制台未见此任务
      } else if (this.taskId === Commonmsg.getTaskID('同步数据')) {
        const inputDialogParams = this.inputDialogParams
        inputDialogParams.visible = true
        inputDialogParams.title = '同步数据地址'
        inputDialogParams.label = '提示信息'
        inputDialogParams.value = row.paramName
        inputDialogParams.name = 'value'
        inputDialogParams.type = 'textarea'
        inputDialogParams.confirm = (res) => {
          row.paramName = res.value
          inputDialogParams.visible = false
        }
      } else if (this.taskId === Commonmsg.getTaskID('机器补丁')) {
        if (
          row.name === '安装补丁前执行流程' ||
          row.name === '安装补丁后执行流程'
        ) {
          this.selectFlowParams = {
            visible: true,
            id: '',
            ismutil: false,
            isNullSelect: false
          }
          this.selectFlowParams.confirm = (params) => {
            row.paramName = params.name
            this.selectFlowParams.visible = false
          }
        } else {
          this.selectAgentLayerParams = {
            visible: true,
            id: ''
          }
          this.selectAgentLayerParams.confirm = (params) => {
            row.paramName = Global.strFormat(
              '{0}[{1}]',
              params.agentIP,
              params.agentName
            )
            this.selectAgentLayerParams.visible = false
          }
        }
      } else if (this.taskId === Commonmsg.getTaskID('同步SQLite数据库')) {
        this.LibrarySettingParams.visible = true
        if (row.name === '主库') {
          this.LibrarySettingParams.title = '主库配置'
        } else if (row.name === '历史库') {
          this.LibrarySettingParams.title = '历史库配置'
        } else if (row.name === '知识库') {
          this.LibrarySettingParams.title = '知识库配置'
        }
        this.LibrarySettingParams.g_data = row
        this.LibrarySettingParams.confirm = (res) => {
          for (let i = 0; i < this.tableData.length; i++) {
            if (this.tableData[i].name === row.name) {
              this.$set(this.tableData[i], 'paramName', res)
            }
          }
          this.LibrarySettingParams.visible = false
        }
      }
    },
    addRow() {
      this.tableData.push({
        id: Global.getGuid(),
        name: '',
        paramName: ''
      })
    },
    deleteRow() {
      if (this.rows.length === 0) { return this.$message.warning('请选择要删除的参数') }
      this.$alert('是否要删除所选中的数据？', '提示', {
        confirmButtonText: '确定',
        showCancelButton: true,
        cancelButtonText: '取消'
      })
        .then(() => {
          const arrID = []
          for (let i = 0; i < this.rows.length; i++) { arrID.push(this.rows[i].id) }
          this.tableData = this.tableData.filter(
            (item) => arrID.indexOf(item.id) === -1
          )
        })
        .catch(() => {})
    },
    initTableRowData() {
      const rows = []
      if (JSON.stringify(this.FlpParam.dataJson) !== '{}') {
        for (let i = 0; i < this.FlpParam.getInt('Count'); i++) {
          rows.push({
            id: Global.getGuid(),
            name: this.FlpParam.getStr('Key_' + i),
            paramName: this.FlpParam.getStr('Value_' + i),
            value: this.FlpParam.getStr('ExtValue_' + i)
          })
        }
      } else {
        if (this.taskId === Commonmsg.getTaskID('任务提示框')) {
          rows.push({
            id: Global.getGuid(),
            name: '任务提示用户',
            paramName: ''
          })
          rows.push({
            id: Global.getGuid(),
            name: '任务提示信息',
            paramName: ''
          })
        } else if (this.taskId === Commonmsg.getTaskID('更新动态基线')) {
          rows.push({ id: Global.getGuid(), name: '统计方案', paramName: '' })
        } else if (this.taskId === Commonmsg.getTaskID('导出组件库')) {
          rows.push({
            id: Global.getGuid(),
            name: '导出组件库路径',
            paramName: ''
          })
        } else if (this.taskId === Commonmsg.getTaskID('导入佣金数据')) {
          rows.push({
            id: Global.getGuid(),
            name: '导入佣金路径',
            paramName: ''
          })
        } else if (this.taskId === Commonmsg.getTaskID('同步数据')) {
          rows.push({
            id: Global.getGuid(),
            name: '同步数据地址',
            paramName: ''
          })
        } else if (this.taskId === Commonmsg.getTaskID('机器补丁')) {
          rows.push({
            id: Global.getGuid(),
            name: '安装补丁前执行流程',
            paramName: ''
          })
          rows.push({
            id: Global.getGuid(),
            name: '安装补丁后执行流程',
            paramName: ''
          })
          rows.push({
            id: Global.getGuid(),
            name: '选择代理端',
            paramName: ''
          })
        } else if (this.taskId === Commonmsg.getTaskID('同步SQLite数据库')) {
          rows.push({ id: Global.getGuid(), name: '主库', paramName: '' })
          rows.push({ id: Global.getGuid(), name: '历史库', paramName: '' })
          rows.push({ id: Global.getGuid(), name: '知识库', paramName: '' })
        }
      }
      this.tableData = rows
    },
    confirm() {
      var vPar = new ParamArr()
      var FlpParam = this.FlpParam
      for (var i = 0; i < this.tableData.length; i++) {
        vPar.setStr('Key_' + i, this.tableData[i].name)
        vPar.setStr('Value_' + i, this.tableData[i].paramName)
        if (this.tableData[i].value) {
          vPar.setStr('ExtValue_' + i, this.tableData[i].value)
        }
      }
      vPar.setInt('Count', this.tableData.length)
      vPar.setStr('Detailed', FlpParam.getStr('Detailed'))
      vPar.setStr('DetailedPass', FlpParam.getStr('DetailedPass'))
      vPar.setBool('NewItem', false)
      if (this.params.confirm !== undefined) {
        this.params.confirm({ FlpParam: vPar })
      } else {
        this.$emit('confirm', { FlpParam: vPar })
      }
    }
  }
}
</script>

<style scoped>
</style>
